<template>
  <div>
    <PageTools />
    <el-card>
      <el-button type="success" round @click="addList"> 新增库区</el-button>
      <el-table :data="list">
        <el-table-column label="序号" align="center" type="index" width="68" />
        <el-table-column label="所属仓库" align="center" width="150" prop="warehouseName" />
        <el-table-column label="库区编号" align="center" prop="code" width="150" />
        <el-table-column label="库区名称" width="150" align="center" prop="name" />
        <el-table-column label="温度类型" width="150" align="center" prop="temperatureType" />
        <el-table-column label="称重类型" width="150" align="center" prop="bearingType" />
        <el-table-column label="用途属性" width="150" align="center" prop="useType" />
        <el-table-column label="库区状态" width="150" align="center" prop="status" />
        <el-table-column label="负责人" width="150" align="center" prop="includedNum" />
        <el-table-column label="联系电话" width="150" align="center" prop="phone" />
        <el-table-column label="库位数量" width="150" align="center" prop="includedNum" />
        <el-table-column label="更新时间" width="150" align="center" prop="updateTime" />

        <el-table-column label="操作" width="180" fixed="right">

          <template #default="{row}">
            <el-button size="small" type="text" @click="edit(row)">编辑</el-button>
            <el-button size="small" type="text" @click="Enable">启用</el-button>
            <el-button size="small" type="text" @click="del(row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-card>
    <el-row type="flex" justify="center" align="middle" style="height:60px;">
      <el-pagination
        :current-page="params.current"
        :page-size="params.size"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
        :page-sizes="[10, 20, 30, 40]"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </el-row>

  </div>
</template>

<script>
import PageTools from '@/layout/components/PageTools'
import { KuQuList, ShanChuKuQu } from '@/api'
export default {
  components: {
    PageTools

  },
  data() {
    return {

      currentPage1: 5,
      currentPage2: 5,
      currentPage3: 5,
      currentPage4: 4,
      list: [],
      params: {
        current: 1,
        size: 10
      },
      total: 0

    }
  },
  created() {
    this.fetchCnangkuList()
  },
  methods: {
    async fetchCnangkuList() {
      const res = await KuQuList(this.params)
      // console.log(res)
      this.list = res.data.records
      this.total = +res.data.total
    },
    onSubmit() {

    },
    handleSizeChange(val) {
      this.params.size = val
      this.fetchCnangkuList()
    },
    handleCurrentChange(val) {
      this.params.current = val
      this.fetchCnangkuList()
    },
    // 新增库区
    addList() {
      this.$router.push({ name: 'KuQu' })
    },
    edit(val) {
      console.log('bianji')
      this.$router.push({ name: 'KuQu', query: { id: val.id }})
    },
    Enable() {

    },
    del(val) {
      this.$confirm('确定删除么？', '温馨提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async() => {
        await ShanChuKuQu(val.id)
        console.log(val.id)
        this.$message.success('删除角色成功')

        this.fetchCnangkuList()
      }).catch(() => {
        this.$message.error('取消删除')
      })
    }
  }
}
</script>

<style>

</style>
